/*PC大屏*/

@media screen and (min-width: 1200px) {
    section {
        width : 1200px;
        margin: 24px auto 0;
    }

    .content-list {
        margin-top: 30px;
    }

    .content-item {
        box-sizing: border-box;
        border    : 1px solid transparent;
        transition: all .3s linear;
    }

    .content-item:hover {
        background   : rgba(255, 255, 255, 0.39);
        border-color : #eaebeb;
        box-shadow   : 0px 0px 20px rgb(0 28 103 / 8%);
        border-radius: 2px;
    }

    .content-item>a {
        width  : 100%;
        padding: 24px;
        display: flex;
    }

    .content-item>a>img {
        margin-right : 24px;
        width        : 368px;
        height       : 207px;
        border-radius: 8px;
        -o-object-fit: cover;
        object-fit   : cover;
    }

    .content-item>a>div {
        padding        : 16px 0;
        display        : flex;
        flex-direction : column;
        justify-content: space-between;
        max-width      : calc(100% - 392px);
    }

    .content-item>a>div h3 {
        font-size    : 24px;
        color        : #000;
        overflow     : hidden;
        text-overflow: ellipsis;
        white-space  : nowrap;
    }

    .content-item>a>div h3+p {
        display           : -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
        overflow          : hidden;
        font-weight       : 400;
        margin-top        : 16px;
        font-size         : 14px;
        color             : rgba(0, 0, 0, .6);
        line-height       : 26px;
    }

    .content-item>a>div>p {
        font-size: 14px;
        color    : rgba(0, 0, 0, .6);
    }

    .content-item>a>div>p:nth-of-type(1) {
        margin: 10px 0;
    }

    .content-item>a>div>p>span::after {
        content: ".";
        display: inline-block;
        margin : 0 16px;
    }


}


/* 头部 */

.container {
    background         : url(https://adyouyi.com/assets/img/header.jpg);
    height             : 36rem;
    background-position: 50%;
    background-size    : cover;
    display            : flex;
    justify-content    : center;
    align-items        : center;
}

.container>div {
    margin-top   : 4rem;
    text-align   : center;
    margin-bottom: 24px;
}

.container>div>h3 {
    font-weight: 400;
    font-size  : 2.5rem;
    color      : #fff;
    line-height: 1;
}

.container>div>.p {
    padding    : 16px 16px 40px 16px;
    font-size  : 1rem;
    color      : #fff;
    white-space: normal;
    box-sizing : border-box;
    width      : 100vw;
}

.container>div>a {
    display         : block;
    width           : 21.6rem;
    height          : 4rem;
    line-height     : 4rem;
    color           : #fff;
    background-color: #3469f8;
    border-color    : #3469f8;
    margin          : 0 auto;
    border-radius   : 4px;
}


/* 头部结束 */


/* 切换 */

/* .ax-menu-tab .ax-item {
    display: block;
    font-size: 18px;
    padding: 0;
}

.ax-menu-tab .ax-item.ax-active {
    color: #3469f8;
}

section .ax-item:not(:first-child) {
    margin-left: 40px;
} */




/* .ax-menu-tab .ax-item:after {
    content          : '';
    height           : 0.2rem;
    width            : 100%;
    background-color : #3469f8;
    -webkit-transform: translate(-50%, 0) scaleX(0);
    transform        : translate(-50%, 0) scaleX(0);
    transition       : all 200ms linear;
    position         : absolute;
    left             : 50%;
    bottom           : -1rem;
} */

.tab {
    display: flex;
    padding: 1.875rem;

}

.tab>li {
    text-align  : center;
    margin-right: 1.25rem;
    position    : relative;
    z-index     : 2;
}

.tab .tab-active {
    color: #3469f8;
}

.tab .tab-active::after {
    content             : '';
    position            : absolute;
    left                : 0;
    bottom              : -0.2rem;
    height              : 0.2rem;
    width               : 100%;
    background-color    : #3469f8;
    /* -webkit-transform: translate(-50%, 0) scaleX(0);
    transform           : translate(-50%, 0) scaleX(0);
    transition          : all 200ms linear;
    position            : absolute;
    /* left             : 50%;
    bottom              : -1rem; */
}



/* 移动端 */

@media screen and (max-width: 1200px) {
    .ax-tab {
        width : 94%;
        margin: auto;
    }

    .content-list {
        margin-top: 20px;
    }

    .content-item {
        box-sizing   : border-box;
        border       : 1px solid #eaebeb;
        transition   : all .3s linear;
        border-radius: 8px;
        margin-bottom: 24px;
        padding      : 10px;
    }

    .content-item>a>img {
        width        : 100%;
        /* height    : 207px; */
        border-radius: 8px;
        -o-object-fit: cover;
    }

    .content-item>a>div {
        padding        : 16px;
        display        : flex;
        flex-direction : column;
        justify-content: space-between;
    }

    .content-item>a>div>h3 {
        font-size         : 24px;
        color             : #000;
        display           : -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow          : hidden;
        margin-bottom     : 16px;
        line-height       : 1.2;
    }

    .content-item>a>div>p {
        font-size: 14px;
        color    : rgba(0, 0, 0, .6);
    }

    .content-item>a>div>p>span {
        color: #000;
    }

    .content-item>a>div>p>span:after {
        content: ".";
        display: inline-block;
        margin : 0 16px;
    }
}

/* 广告二级分类开始 */
.advert {
    position: relative;
}

.advert-list {
    background-color: #fff;
    box-shadow      : 0 0 10px 0 rgba(0, 0, 0, .1);
    position        : absolute;
    top             : 40px;
    left            : -35px;
    color           : #000;
    height          : 0px;
    overflow        : hidden;
    transition      : 200ms;
    text-align      : center;
}

.advert-list li {
    width : 100px;
    height: 30px;
    margin: 10px 0;
}

.advert:hover .advert-list {
    height: 210px;
}

/* 广告二级分类结束 */

.journaInfo-box>div:last-child {
    display        : flex;
    justify-content: space-between;
}